<template>
    <div>
        <h2>搜尋標籤</h2>
        <el-input v-model="searchkey" placeholder="Please input" @keyup.enter="searchHandle">
            <template #append>
                <el-button color="#F06423" @click="searchHandle">搜索</el-button>
            </template>
        </el-input>
        <div class="saerch-result" v-if="isShowResultList">
            <el-empty description="沒有找到符合'标签'的標籤" image=" " />
        </div>
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const searchkey = ref('')
const isShowResultList = ref(false)
const searchHandle = () => {
    isShowResultList.value = true
}
</script>

<style lang="less" scoped>
h2 {
    margin-bottom: 30px;
    font-size: 30px;
    font-weight: normal;
    line-height: 1.2;
    color: #000;
}

.el-empty {
    --el-empty-padding: 10px 0;
    --el-empty-description-margin-top: 0;

    .el-empty__image {
        display: none;
    }
}
</style>
